$include("$theme/feedExploreView.css");

$import("fp.jq.Scrollable");
$import("fp.renderers.FeedDetailRenderer");
$import("fp.renderers.FeedPillowRenderer");
$import("fp.views.BaseFeedView");

with ($ns("fp.views"))
{
    fp.views.FeedExploreView = function($p_container, p_options)
    {
        var me = new fp.views.BaseFeedView($p_container, p_options)
        var base = {};
        
        me.viewType = "explore";
        me.columnCount = Math.floor($(document.body).innerWidth() / 240);
        if (me.columnCount > 7)
        {
            me.columnCount = 7;
        }
        me.pageCount = me.columnCount * 12;
        
        me.renderer = new fp.renderers.FeedPillowRenderer();
        me.detailRenderer = new fp.renderers.FeedDetailRenderer();
        
        
        var _$feeds = [];
        
        
        var _$table = null;
        var _$content = $("<div/>");
        var _$columns = [];
        
        var _$feedDetailContainer = $("<div id='feedDetailContainer'/>");
        var _$feedDetail = $("<div id='feedDetail'/>");
        
        
        
        
        var _$btnNext = $("<div id='nextButton'/>");
        var _$btnPrevious = $("<div id='previousButton'/>");
        
        
        base.init = me.init;
        me.init = function()
        {           
            base.init();
            
            me.$container.addClass("feedExploreView");
            me.$container.verticalScrollable();
            me.$container.bind("scroll", _onscroll);
            
            _initTable();
            
            _$feedDetailContainer.verticalScrollable({
                position: "absolute",
                zIndex: 999999,
                width: "100%",
                paddingTop: 15,
                left: 0,
                right: 0,
                top: 50,
                bottom: 0,
                boxSizing: "border-box"
            });
            _$feedDetailContainer.append(_$feedDetail);
            _$feedDetailContainer.click(function(e){
                if (e.target.id == "feedDetailContainer")
                {
                    me.trigger("maskhiding");
                }
            });

            _$btnNext.attr("title", $msg("fp", "NEXT")).click(me.moveNext);
            _$btnPrevious.attr("title", $msg("fp", "PREVIOUS")).click(me.movePrevious);
            
            me.bind("maskhiding", me.hideDetailView);
        };
        
        base.appendFeeds = me.appendFeeds; 
        me.appendFeeds = function(p_feeds)
        {
            base.appendFeeds(p_feeds);
            me.$container.updateScrollbars();
        }
        
        
        base.clearFeeds = me.clearFeeds;
        me.clearFeeds = function()
        {
            base.clearFeeds();
            for (var i = 0; i < _$feeds.length; i++)
            {
                _$feeds[i].remove();
            }
            _$feeds.clear();
            
            me.$container.updateScrollbars();
        };
        
        
        
        me.renderFeed = function(p_feed)
        {
            var $feed = me.renderer.renderFeed(p_feed);
            if ($feed != null)
            {
                _$columns[_$feeds.length % me.columnCount].append($feed);
                _$feeds.add($feed);
                
                $feed.find("#frame > a#thumbnail").click(_imgLink_click);
            }
        };
        
        
        
        

        base.moveFirst = me.moveFirst;
        me.moveFirst = function()
        {
            if (me.isDetailViewVisible)
            {
                var feed = me.feeds[0];
                var $feed = _$table.find(".feedPillow[id='" + feed.id + "']");
                me.showDetailView(feed, $feed);
            }
            else
            {
                base.moveFirst();
            }
        };
        
        me.moveNext = function()
        {
            if (me.isDetailViewVisible)
            {
                var feed = _$feedDetail.data("feed");
                if (feed != null)
                {
                    var index = me.feeds.indexOf(feed);
                    if (index <= me.feeds.length - 2)
                    {
                        index++;
                        var feed = me.feeds[index];
                        var $feed = _$table.find(".feedPillow[id='" + feed.id + "']");
                        me.showDetailView(feed, $feed);
                    }
                }
            }
            else
            {
                me.$container.stop(true, true);
                me.$container.animate({
                    scrollTop: me.$container.scrollTop() + me.$container.height() / 2
                }, 200, "linear");
            }
        };
        
        me.movePrevious = function()
        {
            if (me.isDetailViewVisible)
            {
                var feed = _$feedDetail.data("feed");
                if (feed != null)
                {
                    var index = me.feeds.indexOf(feed);
                    if (index >= 1)
                    {
                        index--;
                        var feed = me.feeds[index];
                        var $feed = _$table.find(".feedPillow[id='" + feed.id + "']");
                        me.showDetailView(feed, $feed);
                    }
                }
            }
            else
            {
                me.$container.stop(true, true);
                me.$container.animate({
                    scrollTop: me.$container.scrollTop() - me.$container.height() / 2
                }, 200, "linear");
            }
        };
        
        me.toggleStar = function()
        {
            if (me.isDetailViewVisible)
            {
                _$feedDetail.find("#star").click();
            }
        };

        me.openInNewTab = function()
        {
            if (me.isDetailViewVisible)
            {
                var feed = _$feedDetail.data("feed");
                if (feed != null && feed.alternate != null && feed.alternate.length > 0)
                {
                    window.open(feed.alternate[0].href);
                }
            }
        };
        
        
        me.isDetailViewVisible = false;
        var _feedDetailOrigin = {};
        var _feedDetailScrollbarTimer = null;
        me.showDetailView = function(p_feed, $p_feed)
        {
            if (_feedDetailScrollbarTimer != null)
            {
                clearInterval(_feedDetailScrollbarTimer);
            }
            
            if (!me.isDetailViewVisible)
            {
                $(window).bind("keydown", _onkeydown);
                me.trigger("maskshowing");
                $(document.body).append(_$feedDetailContainer.parent());
            }
            else
            {
                _$btnNext.detach();
                _$btnPrevious.detach();
                _$feedDetail.html("");
                if ($p_feed != null && $p_feed.length == 1)
                {
                    var top = $p_feed.absolutePosition().top - me.$container.absolutePosition().top - me.$container.scrollTop();
                    var scrollTop = null;
                    if (top > me.$container.height() - 50)
                    {
                        scrollTop = $p_feed.absolutePosition().top - me.$container.absolutePosition().top - 20;
                    }
                    else if (top < 50)
                    {
                        scrollTop = $p_feed.absolutePosition().top - me.$container.absolutePosition().top - 20;
                    }
                    
                    if (scrollTop != null)
                    {
                        me.$container.animate({
                            scrollTop: scrollTop
                        }, "fast", function()
                        {
                            var pos = $p_feed.absolutePosition();
                            _feedDetailOrigin.$feed = $p_feed;
                            _feedDetailOrigin.left = pos.left;
                            _feedDetailOrigin.top = pos.top - 50;
                            _feedDetailOrigin.width = $p_feed.outerWidth();
                            _feedDetailOrigin.height = $p_feed.outerHeight();
                        });
                    }
                }
            }
            
            if ($p_feed != null && $p_feed.length == 1)
            {
                var pos = $p_feed.absolutePosition();
                _feedDetailOrigin.$feed = $p_feed;
                _feedDetailOrigin.left = pos.left;
                _feedDetailOrigin.top = pos.top - 50;
                _feedDetailOrigin.width = $p_feed.outerWidth();
                _feedDetailOrigin.height = $p_feed.outerHeight();
            }
            
            var bodyWidth = $(document.body).width();
            _$feedDetail.removeClass("starred");
            _$feedDetail.css({
                width: bodyWidth * 0.7,
                height: "auto",
                left: bodyWidth * 0.15,
                top: 50,
                opacity: 1
            });
            
            me.detailRenderer.renderFeed(p_feed, _$feedDetail);
            
            if (!me.isDetailViewVisible)
            {
                _$feedDetail.css("opacity", 0);
                _$feedDetail.animate({ opacity: 1 }, "fast");
            }
            
            
            _$feedDetail.append(_$btnPrevious);
            _$feedDetail.append(_$btnNext);
            _$feedDetailContainer.updateScrollbars();
            _feedDetailScrollbarTimer = setInterval(function(){
                me.$container.updateScrollbars();
            }, 1000);
            
            me.isDetailViewVisible = true;
        };
        
        me.hideDetailView = function()
        {
            if (_feedDetailScrollbarTimer != null)
            {
                clearInterval(_feedDetailScrollbarTimer);
            }

            $(window).unbind("keydown", _onkeydown);
            
            if (_$feedDetail.hasClass("starred"))
            {
                _feedDetailOrigin.$feed.addClass("starred");
            }
            else
            {
                _feedDetailOrigin.$feed.removeClass("starred");
            }
            _$btnNext.detach();
            _$btnPrevious.detach();
            _$feedDetail.html("");
            _feedDetailOrigin.opacity = 0.3;
            _$feedDetail.animate(
               _feedDetailOrigin,
               450,
               "linear",
               function()
               {
                   _$feedDetailContainer.parent().detach();
               }); 
            
            me.isDetailViewVisible = false;
        };
        
        
        
        
        function _initTable()
        {
            _$table = $("<table align='center' cellpadding='0' cellspacing='0'><tbody><tr/></tbody></table>");
            var $row = _$table.find("tr");
            for (var i = 0; i < me.columnCount; i++)
            {
                var $cell = $("<td><div/></td>");
                var $column = $cell.children("div");
                _$columns[i] = $column;
                $row.append($cell);
            }
            me.$container.append(_$table);
        }
        
        
        
        
        function _imgLink_click(e)
        {
            if (e.ctrlKey || e.altKey || e.metaKey || e.shiftKey)
            {
                return;
            }
            if (e.button == 0)
            {
                e.preventDefault();
                var $feed = $(this).closest(".feedPillow");
                var feed = $feed.data("feed");
                me.showDetailView(feed, $feed);
            }
        }
        
        function _onscroll(e)
        {            
            var min = Number.MAX_VALUE;
            for (var i = 0; i < _$columns.length; i++)
            {
                if (_$columns[i].height() < min)
                {
                    min = _$columns[i].height();
                }
            }
            
            var invisibleHeight = min - (me.$container.height() + me.$container.scrollTop());
            
            if (invisibleHeight < me.$container.height() * 1.2)
            {
                me.trigger("loadingrequired");
            }
        }
        
        function _onkeydown(e)
        {
            if (e.keyCode == 39)
            {
                me.moveNext();
            }
            else if (e.keyCode == 37)
            {
                me.movePrevious();
            }
        }
        
        return me;
    }
}